<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%@ include file="/wxflow/jsp2/inc/head_css.jsp"%>


<style>
/* Additional style to fix warning dialog position */
#alertmod_table_list_2 {
	top: 900px !important;
}
</style>
<%@ include file="/wxflow/jsp2/inc/head.jsp"%>


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">保存内容</h4>
			</div>
			<div class="modal-body">
			<form id="myForm">
				<table class="table table-striped table-bordered">
					<tr>
						<td ><input type="hidden" name="docId" id="docId" value="" />标题</td>
						<td><input type="text" id="docSubject" name="docSubject" placeholder="请输入标题" class="col-xs-10 col-sm-10"></td>
					</tr>
					<tr>
						<td >模版ID</td>
						<td>
							<select class="form-control" id="tplId" name="tplId">
							</select>
						</td>
					</tr>
					<tr>
						<td >动作</td>
						<td>
							<select class="form-control" id="actionId" name="actionId">
							</select>
						</td>
					</tr>
					<tr>
						<td >排序</td>
						<td><input type="text" id="fdOrder" name="fdOrder" placeholder="请输入序号" class="col-xs-10 col-sm-10"></td>
					</tr>
					<tr>
						<td >当前执行者</td>
						<td id="hr_show">
							<input type="text" id="curActorName" name="curActorName" placeholder="请输入当前执行者" class="col-xs-10 col-sm-10">
							<input type="hidden" name="curActor" id="curActor" value="" />
							<button type="button" class="btn btn-primary btn-xs" onclick="javaScript:btn_hrShow();">查找</button>
							<div class="dd" id="nestable2">
                                    <ol class="dd-list">
                                        <li class="dd-item">
                                            <div class="dd-handle">
                                                <span class="label label-info"><i class="fa fa-users"></i></span> 上一层级
                                            </div>
                                        </li>

                                        <li class="dd-item" >
                                            <div class="dd-handle">
                                           		<i class='fa fa-minus' id="btnColl_userList"></i>
                                                <span class="label label-warning"><i class="fa fa-users"></i></span> 用户
                                            </div>
                                            <ol class="dd-list" id="userList">
                                                <li class="dd-item" >
                                                    <div class="dd-handle" >
                                                        <span class="pull-right"> 15:00 </span>
                                                        <span class="label label-warning"><i class="fa fa-child"></i></span> 列用户表
                                                    </div>
                                                </li>
                                            </ol>
                                        </li>
                                    </ol>
                                </div>
						</td>
					</tr>
				</table>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="button" class="btn btn-primary"
					onclick="btn_save(this);">提交</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal -->
</div>

<div class="row wrapper border-bottom white-bg page-heading">
	<div class="col-lg-10">
		<ol class="breadcrumb">
			<li><a
				href="${pageContext.request.contextPath}/wxflow/jsp2/index.jsp">主页</a>
			</li>
			<li><a>配置管理</a></li>
			<li><strong>流程配置－模版节点</strong></li>
		</ol>
	</div>
	<div class="col-lg-2"></div>
</div>
<div class="wrapper wrapper-content  animated fadeInRight">
	<div class="row">
		<div class="col-lg-12">
			<div class="ibox ">
				<div class="ibox-title">查询条件
				<div class="ibox-tools">
						<a class="collapse-link"> <i class="fa fa-chevron-up"></i>
						</a> <a class="dropdown-toggle" data-toggle="dropdown"
							href="form_basic.html#"> <i class="fa fa-wrench"></i>
						</a>
						<ul class="dropdown-menu dropdown-user">
							<li><a href="#" id="btn_add"><i class="fa fa-edit"></i>新增</a></li>
							<li><a href="#" id="btn_mod"><i class="fa fa-edit"></i>修改</a></li>
							<li><a href="#" id="btn_del"><i class="fa fa-trash"></i>删除</a></a></li>
						</ul>
						<a class="close-link"> <i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="ibox-content">
					
					<div class="form-inline">
						<label for="sDocSubject">标题</label>
						<input type="text" class="form-control" id="sDocSubject"> 
						<label for="sTplId">模版</label>
						<select class="form-control" id="sTplId" name="sTplId">
						</select>
						<button type="button" id="btn_search" class="btn btn-danger">搜索</button>
					
					</div>

				</div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-lg-12">
			<div class="ibox ">


				<div class="ibox-content">

					<div class="jqGrid_wrapper">
						<div id="pager_list_2"></div>
						<table id="table_list_2"></table>

					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- 业务区展示 [end] -->

<%@ include file="/wxflow/jsp2/inc/foot.jsp"%>
<!-- 业务js控制区 [start] -->
<!-- Peity -->
<script
	src="${pageContext.request.contextPath}/wxflow/res2/js/plugins/peity/jquery.peity.min.js"></script>

<!-- jqGrid -->
<script
	src="${pageContext.request.contextPath}/wxflow/res2/js/plugins/jqgrid/i18n/grid.locale-cn.js"></script>
<script
	src="${pageContext.request.contextPath}/wxflow/res2/js/plugins/jqgrid/jquery.jqGrid.min.js"></script>
<script
	src="${pageContext.request.contextPath}/wxflow/res2/js/plugins/jquery-ui/jquery-ui.min.js"></script>


<script>

var tplObj = new Object();
//格式化 模版
function fn_tpl(cellvalue){
	var temp = tplObj[cellvalue];
	return temp != null?temp:"禁用.";
  
}
function btn_hrCollapse(){
	var id = $(this).attr("id");		
	if($("#"+id).attr("class") == "fa fa-minus"){
		$("#"+id).attr("class","fa fa-plus");
		$("#userList").css("display","none");
	}else{
		$("#"+id).attr("class","fa fa-minus");
		$("#userList").css("display","");
	}
}


function btn_hrShow(){
	//清空
	$("#curActorName").val("");
	$("#curActor").val("");
	//获取当前用户所在层级的人员列表
	fn_getUserJconf($("#curActorName").val());
	//给每个dd-item绑定事件
	$(document).on("click",".show",function(){    
		$("#curActorName").val($(this).data("name"));
		$("#curActor").val($(this).data("id"));
	 })
	$("#nestable2").css("display","");	

}
//获取地址簿人员列表
function fn_getUserJconf(key) {
	var data = new Object();
	data['docStatus'] = "10";
	data['pageNo'] = "1";
	data['pageSize'] = "10";
	data['sFdWxNickName'] = key;
	$
			.ajax({
				url : "${pageContext.request.contextPath}/admin/wxflowUser/list.do",
				async : true,
				dataType : 'json',
				type : 'POST',
				data : data,
				success : function(data, textStatus) {
					$("#userList").html("");
					$.each(data.data.listData, function(i, item) {
						$("#userList").append(
								" <li class='dd-item' data-id='"+item.docId+"' data-name='"+item.fdWxNickName+"' > "+
								"    <div class='dd-handle show' data-id='"+item.docId+"' data-name='"+item.fdWxNickName+"' >"+
								"         <span class='pull-right'> 15:00 </span>"+
								"         <span class='label label-warning'><i class='fa fa-child'></i></span> "+item.fdWxNickName+
								"     </div>"+
								" </li>");
						
					});
				},
				error : function(jqXHR, textStatus,
						errorThrown) {
					var sessionstatus = jqXHRgetResponseHeader("sessionstatus");
					if (sessionstatus == "timeout") {
						alert(i1510.sessionOutMes);
						var req_address = i1510.sessionOutUrl;
						window.location.href = req_address;
					}
				}

			});

}
//更新表格
function fn_freshGrid(pageNo){
	$("#table_list_2").jqGrid(
			'setGridParam', {
				mtype : 'POST',
				datatype : 'json',
				postData : {sDocSubject:$("#sDocSubject").val(),tplId:$("#sTplId").val()}, //发送数据  
				page : pageNo
			})
			.trigger("reloadGrid"); //重新载入  
}
//查询
function btn_search(){
	var pageNo = $('#table_list_2').getGridParam('page');
	fn_freshGrid(pageNo);
	
}
//增加
function btn_add(){
	$("#docId").val("");
	$("#myModal").modal("show");
}
//保存
function btn_save(){
	var data = new Object();
	data = $('#myForm').serialize();
	$.ajax({
		url : "${pageContext.request.contextPath}/admin/wxflowTplNode/save.do",
		async : true,
		data:data,
		dataType : 'json',
		type : 'POST',
		success : function(rtn, textStatus) {
			//业务控制
			if(rtn.result == "success"){
				alert("提交成功!");
			}else{
				alert(rtn.message);
			}

		},
		error : function(jqXHR, textStatus,
				errorThrown) {
			var sessionstatus = jqXHRgetResponseHeader("sessionstatus");
			if (sessionstatus == "timeout") {
				alert(i1510.sessionOutMes);
				var req_address = i1510.sessionOutUrl;
				window.location.href = req_address;
			}
		}

	});
	$("#myModal").modal("hide");
    
}
//修改
function btn_mod(){
	var ids=$("#table_list_2").jqGrid("getGridParam","selarrrow");
	if(ids.length==1){
		var rowid=$("#table_list_2").jqGrid("getGridParam","selrow");//单选
		var rowData = $("#table_list_2").jqGrid("getRowData",rowid);
		var data = new Object();
		data['docId'] = rowData.docId;
		$.ajax({
			url : "${pageContext.request.contextPath}/admin/wxflowTplNode/view.do",
			async : true,
			data:data,
			dataType : 'json',
			type : 'GET',
			success : function(rtn, textStatus) {
				//业务控制
				if(rtn.result == "success"){
					$("#docId").val(rtn.data.docId);
					$("#docSubject").val(rtn.data.docSubject);
					$("#tplId").val(rtn.data.tplId);
					$("#actionId").val(rtn.data.actionId);
					$("#fdOrder").val(rtn.data.fdOrder);
					$("#curActor").val(rtn.data.curActor);
					$("#curActorName").val(rtn.data.curActorName);
					
					$("#myModal").modal("show");
				}else{
					alert(rtn.message);
				}

			},
			error : function(jqXHR, textStatus,
					errorThrown) {
				var sessionstatus = jqXHRgetResponseHeader("sessionstatus");
				if (sessionstatus == "timeout") {
					alert(i1510.sessionOutMes);
					var req_address = i1510.sessionOutUrl;
					window.location.href = req_address;
				}
			}

		});
		
		
	}else{
		alert("修改只能选中一条数据!");
	}
    
}
//删除
function btn_del(){
	if(confirm("是否要删除?")){
		var rowid=$("#table_list_2").jqGrid("getGridParam","selrow");//单选
		if(rowid == null){
			alert("删除时只能选中一条数据!");
		}else{

			var rowData = $("#table_list_2").jqGrid("getRowData",rowid);
			
			var data = new Object();
			data['docStatus'] = "00";
			data['docId'] = rowData.docId;
			$.ajax({
				url : "${pageContext.request.contextPath}/admin/wxflowTplNode/updateStatus.do",
				async : true,
				data:data,
				dataType : 'json',
				type : 'POST',
				success : function(rtn, textStatus) {
					//业务控制
					if(rtn.result == "success"){
						alert("删除成功!");
					}else{
						alert(rtn.message);
					}

				},
				error : function(jqXHR, textStatus,
						errorThrown) {
					var sessionstatus = jqXHRgetResponseHeader("sessionstatus");
					if (sessionstatus == "timeout") {
						alert(i1510.sessionOutMes);
						var req_address = i1510.sessionOutUrl;
						window.location.href = req_address;
					}
				}

			});
		}
	}
    
}
//获取流程模版ID配置
function fn_getFlowTplJconf() {
	var data = new Object();
	data['docStatus'] = "10";
	data['pageNo'] = "1";
	data['pageSize'] = "99";
	$
			.ajax({
				url : "${pageContext.request.contextPath}/admin/wxflowTpl/list.do",
				async : false,
				dataType : 'json',
				type : 'GET',
				data : data,
				success : function(data, textStatus) {
					$.each(data.data.listData, function(i, item) {
						$("#tplId").append(
								"<option value='"+item.docId+"'>"
										+ item.docSubject + "</option>");
						$("#sTplId").append(
								"<option value='"+item.docId+"'>"
										+ item.docSubject + "</option>");
						//组装配置
						tplObj[item.docId] = item.docSubject;
					});
				},
				error : function(jqXHR, textStatus,
						errorThrown) {
					var sessionstatus = jqXHRgetResponseHeader("sessionstatus");
					if (sessionstatus == "timeout") {
						alert(i1510.sessionOutMes);
						var req_address = i1510.sessionOutUrl;
						window.location.href = req_address;
					}
				}

			});

}
//总入口
	$(document)
			.ready(
					function() {
						//获取配置信息
						fn_selAction("#actionId");
						fn_getFlowTplJconf();
						$("#table_list_2")
								.jqGrid(
										{
											url : "${pageContext.request.contextPath}/admin/wxflowTplNode/jqList.do",
											datatype : "json",
											mtype : 'GET',
											height : 'auto',
											autowidth : true,
											shrinkToFit : true,
											//loadonce:true,//关键所在  
											//userDataOnFooter: true,  
											rowNum : 10,
											sortname : 'docId',
											rowList : [ 10, 20, 30 ],
											colNames : [ '序号', '标题', '模版ID','动作','排序','当前执行者','创建时间','状态' ],
											colModel : [ {
												name : 'docId',
												index : 'docId',
												editable : true,
												hidden:true,
												search:false,
												sortable:false
											}, {
												name : 'docSubject',
												index : 'docSubject',
												sortable:false
											}, {
												name : 'tplId',
												index : 'tplId',
												sortable:false,
												formatter:fn_tpl
											}, {
												name : 'actionId',
												index : 'actionId',
												formatter:fn_action,
												sortable:false
											}, {
												name : 'fdOrder',
												index : 'fdOrder',
												sortable:false
											}, {
												name : 'curActorName',
												index : 'curActorName',
												sortable:false
											}, {
												name : 'docCreateTime',
												index : 'docCreateTime',
												sortable:false
											}, {
												name : 'docStatus',
												index : 'docStatus',
												formatter:fn_docStatus,
												sortable:false
											} ],
											jsonReader : {
												repeatitems : false,
												rows : "rows", // 数据行（默认为：rows）  
												total : "total", // 总记录数  
												page : "page", // 当前页  
												records : "records" // 总记录数   
											},
											pager : "#pager_list_2",//工具条的绑定位置
											viewrecords : true,//是否显示总纪录数
											caption : "流程模版-节点列表",//表格名称
											add : false,
											edit : false,
											addtext : 'Add',
											edittext : 'Edit',
											multiselect : true, // 多选
											hidegrid : true,//是否可隐藏表格
											//page:1,
											toolbar : [ false, 'top' ],//是否显示工具栏
											totaltime : 0,
											emptyrecords : "没有符合的数据!",

											onPaging : function(pgButton) {
												var pageNo = $('#table_list_2').getGridParam('page');

												if(pgButton == "next_pager_list_2"){
													//下一页
													pageNo = parseInt(pageNo) + 1;
												}else if(pgButton == "prev_pager_list_2"){
													//前一页
													pageNo = parseInt(pageNo) - 1;
												}else if(pgButton == "first_pager_list_2"){
													//第一页
													pageNo = 1;
												}else if(pgButton == "last_pager_list_2"){
													//最后一页
													pageNo = $('#sp_1_pager_list_2').text();
												}else if(pgButton == "user"){
													//当前页
													pageNo = parseInt(pageNo);
												}
												
												fn_freshGrid(pageNo);

											}

										});

						// Add responsive to jqGrid
						$(window).bind('resize', function() {
							var width = $('.jqGrid_wrapper').width();
							$('#table_list_2').setGridWidth(width);
						});
						
						//绑定
						$("#btn_add").bind("click", btn_add);
						$("#btn_mod").bind("click", btn_mod);
						$("#btn_del").bind("click", btn_del);
						$("#btn_search").bind("click", btn_search);
						//地址簿
						$("#nestable2").css("display","none");
						$.each($("i[id^='btnColl_']"), function(i,val){ 
							$(this).bind("click", btn_hrCollapse);
						});
					});
</script>
<!-- 业务js控制区 [end] -->
